<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Luxury Wallpaper</title>
<meta name="description" content="" />
<meta name="keywords" content="" />
<meta name="author" content="" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no, target-densitydpi=medium-dpi" />
<link rel="stylesheet" href="mobile.css" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script src="js/jquery.masonry.js"></script>
<script type="text/javascript" src="js/spin.js"></script>
<link  href="http://fonts.googleapis.com/css?family=Raleway:100" rel="stylesheet" type="text/css" >
<style>
h1 a{
  font-family: 'Raleway';
  font-style: normal;
  text-decoration: none;
  text-transform: none;
  letter-spacing: 1px;
  word-spacing: 0em;
}
.wrap {background-position: -130px -20px}
</style>
<script language="javascript">
<!--
	var $list;
	var title;
	
	function More()
	{
		var response = "";
		
		$list = $("#container");

		$.getJSON(json_url + "&start-index=1", function(data)
		{
			$.each(data.data.items, function(i, item) 
			{  

				response += '<div class="box photo col1">';
				response += '<a href="http://sub_info.html#' + item.media.image.url + '@' + title + '" class="bwWrapper"><img src="' + item.media.image.url + '" alt="' + item.title + '"></a>';
				response += '</div>';
    		});
    		
			$(response).appendTo($list);
		})
		.complete(function() 
		{
			$list.imagesLoaded( function()
			{
      			$list.masonry({
        			itemSelector : '.box'
      			});
    		});
    		
    		$("#load").hide();
		});
	}
	
	function Load(album_id, name)
	{
		json_url = "http://picasaweb.google.com/data/feed/api/user/snluxurywallpaper@gmail.com/albumid/" + album_id + "?alt=jsonc&kind=photo&max-results=100&orderby=published";
		
		title = name;
		$("#title").html(title);
		$("#load").show();
		
		More();
	}
-->
</script>
</head>
<body>
	<div class="wrap">
		<header>
		  <h1><a href="index.html" id="title"></a></h1>
		</header>
		<div id="container" class="clearfix"></div> <!-- #container -->
		<div id="loading">
			<div id="load" style="display:none;"></div>
		</div>
	</div>
</body>
</html>
<script>
	var opts = {
	  lines: 8, // The number of lines to draw
	  length: 4, // The length of each line
	  width: 3, // The line thickness
	  radius: 6, // The radius of the inner circle
	  color: '#fff', // #rgb or #rrggbb
	  speed: 1, // Rounds per second
	  trail: 54, // Afterglow percentage
	  shadow: false // Whether to render a shadow
	};
	var target = document.getElementById('load');
	var spinner = new Spinner(opts).spin(target);
</script>
